<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
<link href="<s:url value="/view/common_view/css/bootstrap.css"/>" rel="stylesheet" type="text/css" />
<link href="<s:url value="/view/common_view/css/bootstrap.min.css"/>" rel="stylesheet" type="text/css" />

<script>
 $(function() {
   $( document ).tooltip({
     position: {
       my: "center bottom-12",
       at: "center top",
       using: function( position, feedback ) {
         $( this ).css( position );
         $( "<div>" )
           .addClass( "arrow" )
           .addClass( feedback.vertical )
           .addClass( feedback.horizontal )
           .appendTo( this );
       }
     }
   });
 });
</script>

<script>
	function CngClass(obj) {
		if (obj.className==''){
			obj.className = 'selected';
		}else{
			obj.className = '';
		}
	}
</script>

<center>
	<div id="maincontent">
		<input type="hidden" name="categoryID"
			value='<s:property value="%{dealCategory.dealCategoryID}"/>' /> <input
			type="hidden" name="categoryName"
			value='<s:property value="%{categoryName}"/>' />
		<div id="deal-name">
			<s:if test="categoryName!='n/a'||categoryName!=n/a">
				<s:property value="getText('title.tenDMdeal')" />
				<s:property value="categoryName" />
			</s:if>
		</div>
		<s:iterator value="dealresults" var="deal">
			<div class="hh">
				<div class="hh-boxcontainner">
					<div class="hh-name">
						<strong><s:property value="dealName" /></strong>

					</div>
					<a
						href="view-detail-deal.html?dealID=<s:property value="%{dealID}"/>"><img
						class="hh-image"
						src='<s:property value="%{contextPath + imgURL}"/>' /></a>

					<div class="hh-price">
						<span class="product_sprice"><s:property
								value="newSellMoney" /> &nbsp;<s:property value="currencyName" />
						</span> <br> <s:property value="getText('span.giagoc')" /> : <span
							class="product_oprice"><s:property value="newRootMoney" />&nbsp;<s:property
									value="currencyName" /></span>
					</div>
					<a
						href="view-detail-deal.html?dealID=<s:property value="%{dealID}"/>"
						class="btn btn-primary"
						title="Nhấn để xem thông tin chi tiết của deal"
						style="float: right; margin-right: 6%; margin-top: 4%;"><strong>XEM</strong></a>
					<div class="hh-box">
						<div class="hh-savepercent">
							<span class="title"><s:property
									value="getText('span.tietkiem')" /></span> <br> <span class="key"><s:property
										value="percent" />%</span>
						</div>
						<div class="hh-product_bought">
							<span class="title"><s:property
									value="getText('span.soluongdat')" /></span> <br> <span
								class="key"><s:property value="numberOrdered" /></span>
						</div>
						<div class="hh-product_amount">
							<span class="title"><s:property
									value="getText('span.soluongconlai')" /></span><br> <span
								class="key"><s:property value="totalAmount" /></span>
						</div>
					</div>
				</div>
			</div>

		</s:iterator>
		<div id="DividePage">
			<b><s:property value="getText('b.trang')" /></b>
			<s:iterator value="lstPage" id="lstPage" var="p" status="ps">
				<s:if test="#p!=trang">
					<strong><s:a onclick="CngClass(this);" class="iselected" href="home.html?numberPage=%{#ps.count}"><s:property value="#p" />
						</s:a></strong>
				</s:if>

				<s:else>
					<b>[<s:property />]
					</b>
				</s:else>

			</s:iterator>
		</div>

	</div>
</center>
